<template>
  <div class="usehelp">
    <my-head title="使用帮助" :go="true" :ri="false"></my-head>
    <div class="content">

      <div class="list">
        <div class="item" v-for="(item,index) in help" :key="index">
          <p>
            {{item.title}}
            <span v-if="item.ren">({{item.ren}})</span>
            <span v-else></span>
            </p>
          <p>{{item.msg}}</p>
        </div>
      </div>

    </div>
  </div>
</template>

<script>
import Head from "@/components/Head"
export default {
  data(){
    return {
      help:[]
    }
  },
  components:{
    myHead:Head
  },
  created(){
    this.$http.get('../../../../static/json/help.json').then((res)=>{
      // console.log(res.data)
      this.help = res.data
    })
  }
}
</script>

<style scoped lang="less">
  .usehelp{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    .content{
      flex: 1;
      background: #f4f4f4;
      overflow-y: scroll;
      .list{
        width: 100%;
        .item{
          background: #fff;
          margin-top: 0.01rem;
          padding: 0.07rem 0.11rem; 
          p{
            font-size: 0.15rem;
            line-height: 0.27rem;
          }
          p:last-child{
            color: #969696;
            line-height: 0.18rem;
          }
        }
      }
    }
  }
</style>
